<template>
  <a-space>
    <icon v-if="props.symbol === '/'" :style="{ fontSize: '12px', color: '#cfd3d6' }">
      <svg
        t="1655965011938"
        class="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="5463"
        width="16"
        height="16"
      >
        <path
          d="M559.488 96h113.088l-175.52 826.304H384z"
          p-id="5464"
          :fill="props?.color === 'primary' ? 'var(--el-color-primary)' : '#cfd3d6'"
        ></path>
      </svg>
    </icon>
    <icon
      v-else-if="props.symbol === '>'"
      :style="{
        fontSize: '12px',
        color: props?.color === 'primary' ? 'var(--el-color-primary)' : '#cfd3d6'
      }"
    >
      >
    </icon>
    <icon v-else :style="{ fontSize: '12px', fontWeight: 600, color: '#cfd3d6' }">
      <svg
        t="1655965452489"
        class="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="7135"
        width="16"
        height="16"
      >
        <path
          d="M902.343 570.936h-331.78v331.833c0 32.337-26.226 58.537-58.564 58.537-32.337 0-58.563-26.2-58.563-58.537V570.936H121.654c-32.364 0-58.564-26.2-58.564-58.538 0-32.325 26.203-58.537 58.564-58.537h331.78V122.028c0-32.325 26.226-58.537 58.563-58.537 32.338 0 58.564 26.213 58.564 58.537v331.834h331.78c32.364 0 58.565 26.211 58.565 58.535-0.001 32.337-26.2 58.536-58.565 58.536z"
          p-id="7136"
          :fill="props?.color === 'primary' ? 'var(--el-color-primary)' : '#cfd3d6'"
        ></path>
      </svg>
    </icon>
  </a-space>
</template>
<script setup>
// import { ArrowRightBold } from '@element-plus/icons-vue';
import { defineProps } from 'vue';
let props = defineProps({
  symbol: String,
  color: {
    type: String,
    default: 'self'
  }
});
</script>
